<template>
    <ul class="page3">
        <li>
            <p>forEach</p>
            <p v-for="(v,k) in list" v-text="v"></p>
            <br>
            <p v-for="(v,k) in changeList" v-text="v"></p>
        </li>
    </ul>
</template>

<script>
export default {
    name: 'page3',
    data () {
        return {
            list: [1, 2, 3, 4],
            changeList: [],
            list1: [5, 6, 7, 8],
            changeList1: []
        }
    },
    methods: {
        testForEachStr (require, response) {
            require.forEach((value, index, array) => {
                let str = 'value:' + value + ' | ' + 'index:' + index
                response.push(str)
            })
        },
        testForEachStr1 (require, response, obj) {
            require.forEach((value, index, array) => {
                console.log(obj)
            }, obj)
        }
    },
    created () {
        this.testForEachStr(this.list, this.changeList)
    }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style>

</style>